class ElementUtils {
  static generateSettingAreaView(settingAreaId) {
    const diagramContainer = document.createElement('div');
    diagramContainer.style.width = '1850px';
    diagramContainer.style.display = 'flex';
    diagramContainer.style.alignItems = 'stretch';
    diagramContainer.style.paddingTop = '10px';
    diagramContainer.style.paddingBottom = '10px';
    diagramContainer.style.backgroundColor = 'white';
    diagramContainer.id = settingAreaId;
    return diagramContainer;
  }
  static generateResultListAreaView(resultListAreaId) {
    const result_list = document.createElement('div');
    result_list.style.border = '1px solid gray';
    result_list.style.marginRight = '20px';
    result_list.style.padding = '0px';
    result_list.style.width = '192px';
    result_list.style.display = 'inline-block';
    result_list.id = resultListAreaId;
    return result_list;
  }
  static generateQuerysAreaView(querysAreaId) {
    const query_elements_area = document.createElement('div');
    query_elements_area.style.padding = '10px';
    query_elements_area.style.border = '1px solid gray';
    query_elements_area.id = querysAreaId;
    return query_elements_area;
  }
  static addTextFieldTitle(text, element) {
    element.style.marginTop = '25px';
    element.style.position = 'relative';
    const textTitle = this.generateTextField(text);
    textTitle.style.height = '20px';
    textTitle.style.position = 'absolute';
    textTitle.style.top = '-25px';
    element.appendChild(textTitle);
  }
  static generateGraphElementView() {
    const graph_area = document.createElement('div');
    graph_area.style.width = '1850px';
    graph_area.style.height = 'fit-content';
    graph_area.style.padding = '10px';
    graph_area.style.background = 'white';
    graph_area.id = 'tab_graph';
    return graph_area;
  }
  static generateGraphContainerView() {
    const graph_container = document.createElement('div');
    graph_container.style.width = '100%';
    graph_container.id = 'graph_container';
    return graph_container;
  }
  static generateContactElementsContainerView() {
    const contact_elements_area_container = document.createElement('div');
    contact_elements_area_container.style.width = '100%';
    contact_elements_area_container.style.height = 'fit-content';
    contact_elements_area_container.style.padding = 0;
    return contact_elements_area_container;
  }
  static generateTabView(tabViewIds, tabTexts) {
    const tabView = document.createElement('div');
    tabView.id = 'tab_view';
    tabView.style.height = 'fit-content';
    tabView.style.width = 'fit-content';
    const ul = document.createElement('ul');
    const li0 = document.createElement('li');
    const a0 = document.createElement('a');
    a0.href = `#${tabViewIds[0]}`;
    a0.innerHTML = tabTexts[0];
    li0.appendChild(a0);
    ul.appendChild(li0);
    const li1 = document.createElement('li');
    const a1 = document.createElement('a');
    a1.href = `#${tabViewIds[1]}`;
    a1.innerHTML = tabTexts[1];
    li1.appendChild(a1);
    ul.appendChild(li1);
    tabView.appendChild(ul);
    return tabView;
  }
  static generateSaveStatusButton(text, save_status_button_Id) {
    const button = document.createElement('button');
    button.classList.add('kintoneplugin-button-normal');
    button.innerText = text;
    button.style.color = 'white';
    button.style.background = '#48A8E8';
    button.id = save_status_button_Id;
    return button;
  }
  static getElementView(elementId) {
    return document.getElementById(elementId);
  }
}
export {
  ElementUtils
};